<template>
  <div class="mt-[8px]">
    <div class="flex h-[40px] text-[14px]" style="background-color: #1B3E6B;color: #B4C0CC;">
        <div class="w-[155px] pl-[20px] flex items-center">序号</div>
        <div class="flex-1 flex items-center">关注问题</div>
        <div class="w-[71px] mr-[69px] flex justify-center items-center">操作</div>
      </div>
    <vue-seamless-scroll :class-option="classOption" :data="listData" class="warp overflow-hidden h-[280px]" :class="type?'h-[400px]':'h-[280px]'">
      <div class=" text-[14px] Flist" v-for="(item,index) in listData" :key="index" style="color: #B4C0CC;border-left: 2px solid transparent;pointer-events: auto;">
        <div class="flex  h-[40px]">
          <div class="w-[155px] pl-[20px] flex items-center">{{ item.px }}</div>
        <div class="flex-1 flex items-center">关注问题</div>
        <div class="w-[71px] mr-[69px] flex justify-center items-center cursor-pointer" style="color: #29B2FF;">查看</div>
        </div>
      </div>

  </vue-seamless-scroll>
</div>

</template>

<script >
export default {
  name: 'HelloWorld',
  props: ['listData','type'],
  data() {
    return {
      classOption: {
          hoverStop: true,
          step: 0.5
        },

    }
  },
}

</script>
<style  >
.Flist:hover{
  border-left: 2px solid #1170ef;
  background: rgba(31,73,126,0.3);
  cursor: pointer;
}

</style>